<template>
  <div style="margin-top: 30px;margin-left:200px; width: 700px;">
    <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="100px"
      class="demo-ruleForm"
    >
      <el-form-item label="职位名称" prop="name">
        <el-input v-model="ruleForm.name"></el-input>
      </el-form-item>

      <el-form-item label="学历要求" prop="low_edu">
        <el-select v-model="ruleForm.lowEdu" placeholder="请选择所需最低学历">
          <el-option label="无要求" value="无要求"></el-option>
          <el-option label="专科" value="专科"></el-option>
          <el-option label="本科" value="本科"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="发布时间" required>
        <el-col :span="11">
          <el-form-item prop="releaseDate">
            <el-date-picker  placeholder="选择日期" v-model="ruleForm.releaseDate"  style="width: 100%;"></el-date-picker>
          </el-form-item>
        </el-col>
      </el-form-item>

      <el-form-item label="招聘人数" prop="number">
        <el-input-number v-model="ruleForm.number" @change="handleChange" :min="1" label="描述文字"></el-input-number>
      </el-form-item>

      <el-form-item label="工作地点" prop="place">
        <el-input v-model="ruleForm.place" style="width: 500px"></el-input>
      </el-form-item>

      <el-form-item label="薪资范围" prop="salary">
        <el-input v-model="ruleForm.salary" style="width: 600px"></el-input>
      </el-form-item>
      <el-form-item label="相关福利" prop="welfare">
        <el-input v-model="ruleForm.welfare" style="width: 500px"></el-input>
      </el-form-item>

      <el-form-item label="联系人" prop="contactName">
        <el-input v-model="ruleForm.contactName" style="width: 100px"></el-input>
      </el-form-item>

      <el-form-item label="联系人电话" prop="contactPhone">
        <el-input v-model="ruleForm.contactPhone" style="width: 200px"></el-input>
      </el-form-item>

      <el-form-item label="工作要求" prop="requirement">
        <el-input type="textarea" v-model="ruleForm.requirement"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="submitForm('ruleForm')">立即修改</el-button>
        <el-button @click="resetForm('ruleForm')">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
  category: null,
  data() {
    return {
      ruleForm: {
        name: "",
        lowEdu: "",
        place: "",
        releaseDate: "",
        salary: "",
        contactName: "",
        contactPhone: "",
        requirement: "",
        number: "",
        welfare: ""
      },
      rules: {
        name: [{ required: true, message: "请输入职位名称", trigger: "blur" }],
        lowEdu: [{ required: true, message: "请选择最低学历", trigger: "change" }],
        releaseDate: [{required: true, message: "请选择日期", trigger: "change"}],
        place: [{ required: true, message: "工作地点", trigger: "blur" }],
        contactName: [{ required: true, message: "请输入联系人", trigger: "blur" } ],
        welfare: [{ required: true, message: "请输入相关福利", trigger: "blur" }],
        salary: [{ required: true, message: "薪资范围", trigger: "blur" }],
        contactPhone: [ {required: true,message: "请输入联系人电话",trigger: "blur"},
          { min: 11, max: 11, message: "长度在 11个字符", trigger: "blur" }],
        requirement: [{ required: true, message: "请填写工作要求", trigger: "blur" }]}
    };
  },
  methods: {
    handleChange(value) {
      console.log(value);
    },
    submitForm(formName) {
      const _this = this;
      this.$refs[formName].validate(valid => {
        //提交后
         if (valid) {
                        axios.put('http://localhost:8182/recruitment/update',_this.ruleForm).then(function (resp) {
                            if(resp.data.code == 0){
                                _this.$alert(_this.ruleForm.name+'修改成功', '', {
                                    confirmButtonText: '确定',
                                    callback: action => {
                                        _this.$router.push('/recallRecruitment')
                                    }
                                });
                            }
                        })
                    }
                });
                },
            
    resetForm(formName) {
      this.$refs[formName].resetFields();
    }
  },
  //拿后台数据
    created(){
      const _this = this
      axios.get('http://localhost:8182/recruitment/findById/'+_this.$route.query.id).then(function(resp){
        _this.ruleForm=resp.data.data
      })
      /* console.log(_this.$route.query.id) */
    }
};
</script>
